<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<!-- 引入样式 -->
		<link rel="stylesheet" href="https://unpkg.com/element-ui@next/lib/theme-default/index.css">
		<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
		<title>按钮弹窗</title>
	</head>
	<body>
		<div id="app">
			<el-button class="btn" v-on:click="visible = true">按钮</el-button>
			<el-dialog v-model="visible" title="Hello World!"></el-dialog>
			<i class="el-icon-edit"></i>
			<i class="el-icon-share"></i>
			<i class="el-icon-delete"></i>
			<i class="el-icon-loading"></i>
			<i class="el-icon-circle-check"></i>
			<i class="el-icon-circle-cross"></i>
			<i class="el-icon-search"></i>
			<el-button type="primary" icon="search">搜索</el-button>
			<el-button>默认按钮</el-button>
			<el-button type="primary">主要按钮</el-button>
			<el-button type="text">文字按钮</el-button>
			<el-button :plain="true" :disabled="true">主要按钮</el-button>
			<el-button type="primary" :disabled="true">主要按钮</el-button>
			<el-button type="text" :disabled="true">文字按钮</el-button>
			<span class="wrapper">
			    <el-button type="success">成功按钮</el-button>
			    <el-button type="warning">警告按钮</el-button>
			    <el-button type="danger">危险按钮</el-button>
			    <el-button type="info">信息按钮</el-button>
		    </span>
		    <span class="wrapper">
			    <el-button :plain="true" type="success">成功按钮</el-button>
			    <el-button :plain="true" type="warning">警告按钮</el-button>
			    <el-button :plain="true" type="danger">危险按钮</el-button>
			    <el-button :plain="true" type="info">信息按钮</el-button>
		    </span>
		    <el-button type="primary" icon="edit"></el-button>
			<el-button type="primary" icon="share"></el-button>
			<el-button type="primary" icon="delete"></el-button>
			<el-button type="primary" icon="search">搜索</el-button>
			<el-button type="primary">上传<i class="el-icon-upload el-icon--right"></i></el-button>
		</div>
		
		<!-- 先引入 Vue -->
	    <script src="https://unpkg.com/vue/dist/vue.js"></script>
	    <!-- 引入组件库 -->
	    <script src="https://unpkg.com/element-ui/lib/index.js"></script>
	    <script type="text/javascript">
	    	
	    	var app = new Vue({
	    		el: '#app',
	    		data: function (){
	    			return {visible: false}
	    		}
	    	})
	    </script>
	</body>
</html>
